Skip to main content

Alternativ navigasjon

Denne artikkelen omhandler lovkrav og beste praksis relatert til navigasjonsalternativer. Dette er spesielt relevant når en gitt navigasjonsform ikke er tilgjengelig. Dette kan forekomme av ulike grunner, av tekniske grunner, på grunn av brukerbehov eller knyttet til situasjonsavhengige omstendigheter. Alternativ navigasjon muliggjør bruk av digitale læremidler når hovedformen for interaksjon av ulike årsaker ikke er tilgjengelig.

Denne artikkelen omhandler alternativ navigasjon og fokuserer spesielt på tastaturnavigasjon som alternativ til navigasjon med musepeker eller berøringsskjerm.

Relevante krav​

  • 2.1.1
    All funksjonalitet skal kunne brukes kun ved hjelp av tastatur.

  • 2.1.2
    Unngå tastaturfeller

  • 2.1.4
    Gi mulighet til å deaktivere hurtigtaster som kun består av ett tegn.

  • 2.4.1
    Gi mulighet til å hoppe direkte til hovedinnholdet

  • 2.4.3
    Presenter innholdet i logisk rekkefølge

  • 2.4.7
    Sørg for at alt innhold får synlig fokus når du navigerer med tastatur.

  • 3.2.1
    Sørg for at utforming og innhold ikke endres kun basert på endring av fokus.

  • 3.2.3
    Navigasjonslenker som gjentas på flere sider skal ha konsekvent rekkefølge.

  • 3.2.4
    Elementer som har samme funksjonalitet på tvers av flere sider er utformet likt.

Brukergrupper​

  • Elever med motoriske utfordringer
  • Elever med nedsatt mobilitet
  • Blinde og svaksynte elever
  • Elever med situasjonsbaserte utfordringer (f.eks. midlertidig skade eller begrensninger)

Formål​

Formålet med kravene er å sikre at alle elever kan bruke digitale læremidler uavhengig av motorisk evne, eller om de ikke kan bruke mus eller berøringsskjerm. Dette gir alle brukere en likeverdig mulighet til å navigere og interagere med digitalt innhold.

Utviklerrollen​

Som utvikler har du ansvar for å sikre at alle funksjoner kan nås og betjenes via tastatur.

  • Sørg for at alle interaktive elementer er tilgjengelige med tastaturet (f.eks. via Tab-tasten). For økt tilgjengelighet og likeverdig tilgang for så mange elever som mulig er det viktig å gjøre tastaturnavigeringen så enkel som mulig. Tenk over hvor mange taster som trengs for å navigere det digitale læremidlet. Noen elever navigerer ved hjelp av kun 1 - 4 brytere.
  • Enkelte elementer eller innholdstyper navigeres best med en kombinasjon av flere taster. Undersøk derfor beste praksis for navigasjon av innhold og oppgavetyper i ditt læremiddel. Les mer om tastaturnavigasjon Tastaturnavigasjon | UU-tilsynet (Åpnes i ny fane) Les mer om standard bruk av forskjellige taster WCAG-standarden 2.1.2 Ingen tastaturfelle (Nivå A) | UU-tilsynet (Åpnes i ny fane)
  • Implementer tastaturfokus klart synlig (f.eks. CSS :focus).
  • Unngå funksjoner som er avhengige av spesifikke musebevegelser eller pekerbaserte handlinger.
  • Sørg for at brukere enkelt kan navigere inn og ut av komponenter som modaler og menyer med tastatur.
  • Vær obs på at tastaturnavigering skiller seg fra navigering ved bruk av skjermleser. Skjermleserbrukere bruker vanligvis andre funksjoner og hurtigtaster som ikke fungerer ved ren tastaturnavigering. Skjermleserprogrammer har også egne fokusmarkeringer som skiller seg fra fokusmarkeringen i nettleseren. Vi anbefaler å teste med både tastaturnavigering og ulike skjermlesere.
  • Vær obs på at elementer som bruker ARIA ikke automatisk blir tilgjengelige for tastaturnavigering. Les mer om hvordan dette kan løses her:
    Developing a Keyboard Interface | APG | WAI | W3C (Åpnes i ny fane)

Hvordan oppnå samsvar med minstekravene?​

  • Alle funksjoner skal kunne utføres med tastatur alene.
  • Navigasjon med tastaturet skal være logisk og forutsigbar.
  • Fokusindikatoren skal alltid være synlig og tydelig.
  • Implementering av skip links i henhold til WCAG 2.4.1. Les mer om dette hos Nav Aksel: 2.4.1 Hoppe over blokker (skip-links) - aksel.nav.no (Åpnes i ny fane)
  • Det skal ikke forekomme endringer i utformingen eller innholdet i det digitale læremidlet som følge av endret fokus alene.
  • Navigasjonslenker og andre elementer som gjentas på flere sider skal opptre konsekvent og med lik rekkefølge.
  • Dersom formålet med gitt innhold er knyttet til en bestemt navigasjonsform gjelder unntak fra kravet om tastaturnavigasjon. I læremidler kan dette for eksempel være simulering av håndskrift eller maling.

Beste praksis​

  • Tilby én skip-link til sidens hovedinnhold (h1 -elementet).
  • Bruk standard HTML-kontroller (knapper, lenker, skjemaelementer) da disse har innebygd støtte for tastaturnavigasjon. Les mer hva som gjør at elementer kan få fokus her: Keyboard accessible | mdn web docs (Åpnes i ny fane)
  • Implementer tydelig CSS :focus-stiler for å forbedre brukeropplevelsen for tastaturbrukere.
  • Test regelmessig med tastatur for å sikre god flyt og tilgjengelighet.
  • Unngå å innføre egne hurtigtaster, dette kan komme i konflikt med hjelpemiddelteknologi som skjermlesere.

Feller å unngå​

  • Ikke skjul tastaturfokusindikatoren med CSS (f.eks. outline:none).
  • Unngå bruk av elementer som ikke er naturlig tilgjengelige via tastatur. Her kan jobben gjøres enklere ved riktig bruk av semantisk HTML. Les mer hva som gjør at elementer kan få fokus her: Keyboard accessible | mdn web docs (Åpnes i ny fane)
  • Ikke bruk funksjoner som krever spesifikke musehandlinger (f.eks. drag-and-drop) uten en alternativ navigasjonsform.

Tips og tricks​

  • Gjør hyppige tester ved å navigere gjennom nettstedet eller applikasjonen med tastatur.

Les mer​